<template>
  <div class="home">
    <!-- 这是使用vuex方式 -->
    <h1>{{$store.state.num}}</h1>
    <button @click="addOne">+1</button>

    <!-- 这是使用普通方式 -->
    <h1>{{num}}</h1>
    <button @click="addNum">+1</button>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'

export default {
  name: 'home',
  components: {
    HelloWorld
  },
  data(){
    return{
      num:0
    }
  },
  methods:{
    // 这是使用vuex的方式
    addOne(){
      this.$store.commit("addNum");
      console.log(this.$store.state.num);
      
    },
    // 这是普通方式进行递增
    addNum(){
      this.num++
    }
  }
}
</script>
